<%@ page language="java" import="java.util.*" pageEncoding="utf-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%response.setHeader("cache-control","public"); %>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE>
<html>
<!-- 练习题库选择 -->
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <title>在线练习题</title>

    <link rel="stylesheet" type="text/css" href="../../css/bootstrap.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/common.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/practice/items.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/practice/formedia.css"/>

    <!--[if lt IE 9]>
    <script src="../../js/html5shiv.js"></script>
    <script src="../../js/respond.min.js"></script>
    <![endif]-->
    <script type="text/javascript" src="../../js/html5.js"></script>
    <script type="text/javascript" src="../../js/respond.js"></script>

</head>

<body>
<!--head begin-->
<jsp:include page="../head.jsp" flush="true"/>
<!--head end-->
<div class="middlebox bgcolor body-box container">

    <div class="tishi">
        <div class="tishi-box">
            <p class="tishi-p"><span class="glyphicon glyphicon-info-sign"></span> 您好, <span style="color: #800000;">XXX</span>
                !在首次使用在线练习系统时，请先从下表中选择练习题库</p>
        </div>
        <div class="container borderbottom">

        </div>
    </div>
    <div class=" KaoshiXinXi-ctn ">

        <div class="">
            <div class="col-lg-3 col-md-4 col-sm-6  col-xs-6 KaoshiXinXi-box">
                <a href="item-knows.jsp">
                    <div id="mediamin300" class=" col-md-12 col-xs-12 col-lg-12 col-sm-12 btn btn-default ">
                        <div id="mediamin200 " class="col-md-12 col-xs-12 col-lg-12 col-sm-12">
                            <img id="mediamin200 " class="col-md-12 col-xs-12 col-lg-12 col-sm-12 "
                                 src="../../images/practice/sfks.jpg"/>
                        </div>
                        <div class="progress-my progress-striped-my col-md-12 col-xs-12 col-lg-12 col-sm-12 KaoshiXinXi-btn-jindutiao">
                            <div class="progress-bar-my progress-bar-success-my " style="width:80% "> 80%</div>
                        </div>
                        <p class=" col-md-12 col-xs-12 col-lg-12 col-sm-12 KaoshiXinXi-ctn-p1">
                            XXXXXXXXXXXXXXXXXXX考试题库基本级基本级基本级（2016）</p>
                    </div>
                </a>
            </div>
            <div class="col-lg-3 col-md-4 col-sm-6 col-xs-6 KaoshiXinXi-box">
                <a href="item-knows.jsp">
                    <div id="mediamin300" class=" col-md-12 col-xs-12 col-lg-12 col-sm-12 btn btn-default">
                        <div id="mediamin200" class="col-md-12 col-xs-12 col-lg-12 col-sm-12 ">
                            <img id="mediamin200" class="col-md-12 col-xs-12 col-lg-12 col-sm-12"
                                 src="../../images/practice/sfks.jpg"/>
                        </div>
                        <div class="progress-my progress-striped-my col-md-12 col-xs-12 col-lg-12 col-sm-12 KaoshiXinXi-btn-jindutiao">
                            <div class="progress-bar-my progress-bar-success-my " style="width:50%"> 50%</div>
                        </div>
                        <p class=" col-md-12 col-xs-12 col-lg-12 col-sm-12 KaoshiXinXi-ctn-p1">
                            XXXXXXXXXXXXXXXXXXX考试题库中级（2016）</p>
                    </div>
                </a>
            </div>
            <div class="col-lg-3 col-md-4 col-sm-6  col-xs-6 KaoshiXinXi-box">
                <a href="item-knows.jsp ">
                    <div id="mediamin300" class="col-md-12 col-xs-12 col-lg-12 col-sm-12 btn btn-default">
                        <div id="mediamin200 " class="col-md-12 col-xs-12 col-lg-12 col-sm-12">
                            <img id="mediamin200 " class="col-md-12 col-xs-12 col-lg-12 col-sm-12 "
                                 src="../../images/practice/sfks.jpg"/>
                        </div>
                        <div class="progress-my progress-striped-my col-md-12 col-xs-12 col-lg-12 col-sm-12 KaoshiXinXi-btn-jindutiao ">
                            <div class="progress-bar-my progress-bar-success-my " style="width:100% "> 80%</div>
                        </div>
                        <p class=" col-md-12 col-xs-12 col-lg-12 col-sm-12 KaoshiXinXi-ctn-p1 ">XXXXXX 考试（2016）</p>
                    </div>
                </a>
            </div>
            <div class="col-lg-3 col-md-4 col-sm-6  col-xs-6 KaoshiXinXi-box">
                <a href="item-knows.jsp ">
                    <div id="mediamin300" class="col-md-12 col-xs-12 col-lg-12 col-sm-12 btn btn-default">
                        <div id="mediamin200 " class="col-md-12 col-xs-12 col-lg-12 col-sm-12">
                            <img id="mediamin200 " class="col-md-12 col-xs-12 col-lg-12 col-sm-12 "
                                 src="../../images/practice/sfks.jpg"/>
                        </div>
                        <div class="progress-my progress-striped-my col-md-12 col-xs-12 col-lg-12 col-sm-12 KaoshiXinXi-btn-jindutiao ">
                            <div class="progress-bar-my progress-bar-success-my " style="width:100% "> 80%</div>
                        </div>
                        <p class=" col-md-12 col-xs-12 col-lg-12 col-sm-12 KaoshiXinXi-ctn-p1 ">XXXXXX 考试（2016）</p>
                    </div>
                </a>
            </div>
            <div class="col-lg-3 col-md-4 col-sm-6 col-xs-6 KaoshiXinXi-box">
                <a href="item-knows.jsp">
                    <div id="mediamin300" class=" col-md-12 col-xs-12 col-lg-12 col-sm-12 btn btn-default">
                        <div id="mediamin200" class="col-md-12 col-xs-12 col-lg-12 col-sm-12 ">
                            <img id="mediamin200" class="col-md-12 col-xs-12 col-lg-12 col-sm-12"
                                 src="../../images/practice/sfks.jpg"/>
                        </div>
                        <div class="progress-my progress-striped-my col-md-12 col-xs-12 col-lg-12 col-sm-12 KaoshiXinXi-btn-jindutiao">
                            <div class="progress-bar-my progress-bar-success-my " style="width:40%"> 80%</div>
                        </div>
                        <p class=" col-md-12 col-xs-12 col-lg-12 col-sm-12 KaoshiXinXi-ctn-p1">XXXXXXXXXXXX 考试（2016）</p>
                    </div>
                </a>
            </div>

            <div class="tipss col-lg-12 col-md-12 col-sm-12 col-xs-12 displaynone">
                <span class="tipss-sp">题库简介：</span><br/> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;本题库根据考试大纲规定的考试内容，分类编撰，
                <b>适合参加考试的学习使用</b>， 也可作为广大学员自学知识的参考资料
            </div>

        </div>
    </div>
</div>
<div class="du45">

</div>
<div class="huadd">


    <span class="glyphicon glyphicon-menu-down"></span>
</div>

<!--[if !IE]> -->
<script type="text/javascript">
    window.jQuery || document.write("<script src='../../js/jquery-2.0.3.min.js'>" + "<" + "/script>");
</script>
<!-- <![endif]-->

<!--[if IE]>
<script type="text/javascript">
    window.jQuery || document.write("<script src='../../js/jquery-1.9.1.min.js'>"+"<"+"/script>");
</script>
<![endif]-->
<script type="text/javascript" language="JavaScript" src="../../js/bootstrap.min.js"></script>
<script type="text/javascript" language="JavaScript" src="../../js/practice/exam-jump.js"></script>
<script type="text/javascript" src="../../js/global.js"></script>
<script type="text/javascript" src="../../js/tooltip.js"></script>
<script type="text/javascript">
    var ff = {};
    var browser = {
        versions: function () {
            var u = navigator.userAgent,
                app = navigator.appVersion;
            return {
                trident: u.indexOf('Trident') > -1, //IE内核
                presto: u.indexOf('Presto') > -1, //opera内核
                webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
                gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
                mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
                ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
                android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android终端
                iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
                iPad: u.indexOf('iPad') > -1, //是否iPad
                webApp: u.indexOf('Safari') == -1, //是否web应该程序，没有头部与底部
                weixin: u.indexOf('MicroMessenger') > -1, //是否微信 （2015-01-22新增）
                qq: u.match(/\sQQ/i) == " qq" //是否QQ
            };
        }(),
        language: (navigator.browserLanguage || navigator.language).toLowerCase()
    };
    $(document).ready(function () {
        if (browser.versions.trident) {
            ff.scollheiht = $(window).height();
        } else if (browser.versions.gecko) {
            ff.scollheiht = document.body.clientHeight;
        } else {
            ff.scollheiht = $(window).height();
        }
//				ff.htmlheiht = $(".middlebox").height() + 162 + 60;
//				//		alert(ff.htmlheiht+"页面可视区域"+ff.scollheiht);
//				if(ff.htmlheiht < ff.scollheiht) {
//					$(".footer").css("position", "fixed")
//						.css("bottom", "0");
//				}
        if (browser.versions.trident) {
            ff.scollwidthh = $(window).width()
        } else if (browser.versions.gecko) {
            ff.scollwidthh = document.body.clientWidth;
        } else {
            ff.scollwidthh = $(window).width();
        }
        $(".huadd").css("left", ff.scollwidthh / 2 - 25 + "px")
        if (ff.scollwidthh < 768) {
            binking();
            $(window).scroll(function (event) {
                clearTimeout(ff.bink)
                $(".KaoshiXinXi-box").css("padding", "0px!important")
                    .css("width", "80%")
                    .css("margin-left", "10% !important")

            });


        }

        $(".KaoshiXinXi-box").find(".btn-default").mousedown(function () {
            $(this).css("background-color", "#eeFAFF");
        })
        $(".KaoshiXinXi-box").find(".btn-default").mouseup(function () {
            $(this).css("background-color", "#FFFFFF");
        })
        $(".KaoshiXinXi-box").find(".btn-default").mousemove(function () {

            ff.trbl = this.getBoundingClientRect().bottom;
            ff.e = $(".middlebox")
            ff.lleft = ff.e[0].getBoundingClientRect().left;
            ff.widdth = ff.e.width();
            ff.tipsj = $(".tipss")
            ff.tipsleftdu45 = (this.getBoundingClientRect().left + this.getBoundingClientRect().right - 55) / 2
            ff.tipsj.css("top", ff.trbl)
                .css("left", ff.lleft + 45 + "px")
                .css("width", ff.widdth - 90 + "px");
            $(".du45").css("top", ff.trbl)
                .css("left", ff.tipsleftdu45 + "px")
            if (browser.versions.trident) {
                $(".du45").css("margin-top", "8px")
            }
            ff.tipsj.removeClass("displaynone");
            $(".du45").removeClass("displaynone");
        })
        $(".KaoshiXinXi-box").find(".btn-default").mouseleave(function () {

            ff.tipsj = $(".tipss")
            ff.tipsj.addClass("displaynone")
            $(".du45").addClass("displaynone");
        })
    });

    function binking() {
        $(".huadd").fadeIn(1300).fadeOut(800);
        ff.bink = setTimeout("binking()", 2500)
    }

</script>

</body>

</html>